<ion-scroll class="scrollHeight" scrollX="true">
  <div class="block-box">
    <div class="block" *ngFor="let deviceName of userProvider.deviceList;index as i" [ngClass]="{'selected':selectedDeviceIndex==i}" (click)="selectDevice(i,deviceProvider.devices[deviceName])">
      <img class="block-img" src="assets/img/devices/{{deviceProvider.devices[deviceName].config.image}}" onError="this.src='assets/img/devices/unknown.png'" />
      <div class="h-line"></div>
      <div class="block-text">
        <span>
          {{deviceProvider.devices[deviceName].config.customName}}
        </span>
      </div>
      <img *ngIf="deviceProvider.devices[deviceName].config.mode=='ble'" class="mode" src="assets/img/icon/ble.png" />
      <img *ngIf="deviceProvider.devices[deviceName].config.mode=='net'" class="mode" src="assets/img/icon/wifi.png" />
      <img *ngIf="deviceProvider.devices[deviceName].config.mode=='mqtt'" class="mode" src="assets/img/icon/mqtt.png" />
    </div>
  </div>
</ion-scroll>